/*
 * @Description: 限制输入为最多两位小数的数字
 * @Author: Kerwin
 * @Date: 2025-03-29 16:30:54
 * @LastEditTime: 2025-06-04 10:00:00
 */

// 扩展 HTMLInputElement 类型
declare global {
  interface HTMLInputElement {
      __vueCleanup?: () => void;
  }
}

import type { Directive } from 'vue'

export const keepTwoDecimal2: Directive = {
  mounted(el, binding) {
      el.addEventListener(
          'input',
          (e: any) => {
              try {
                  let value = e.target.value;

                  // 1. 当第一位为0时，只能输入小数点【第二位必须是小数点】
                  if (value.charAt(0) === '0' && value.length > 1 && value.charAt(1) !== '.') {
                      value = '0';
                  } else if (value.length === 1 && value.charAt(0) === '.') {
                      // 如果第一位输入的是小数点，则直接置空
                      value = '';
                  } else if (value.length === 1) {
                      e.target.selectionStart = value.length + 1;
                      e.target.selectionEnd = value.length + 1;
                  } else {
                      // 当 input 的 type 不为 text 时，输入小数时，光标会前移，此处需要手动将光标后移
                      if (e.data === '.') {
                          e.target.selectionStart = value.length + 1;
                          e.target.selectionEnd = value.length + 1;
                      }

                      value = value.replace(/[^\d.]/g, ''); // 清除"数字"和"."以外的字符
                      value = value.replace(/\.{2,}/g, '.'); // 只保留第一个. 清除多余的
                      value = value.match(/^\d{0,5}(\.?\d{0,2})/g)?.[0] || ''; // 保留两位小数
                  }

                  e.target.value = value;
              } catch (e) {
                  throw new Error('输入时发生异常！');
              }
          },
          true,
      );
  },
};